<template>
  <t-space direction="vertical">
    <t-date-range-picker
      allow-input
      clearable
      format="YYYY-MM-DD HH:mm:ss"
      :default-time="['00:00:00', '22:22:22']"
      @pick="onPick"
      @change="onChange"
    />
    <t-date-range-picker enable-time-picker allow-input clearable @pick="onPick" @change="onChange" />
  </t-space>
</template>

<script setup>
const onPick = (value, context) => console.log('onPick:', value, context);
const onChange = (value, context) => {
  console.log('onChange:', value, context);
  console.log(
    'timestamp:',
    context.dayjsValue.map((d) => d.valueOf()),
  );
  console.log(
    'YYYYMMDD:',
    context.dayjsValue.map((d) => d.format('YYYYMMDD')),
  );
};
</script>
